<template>
  <div>
    <h1>{{msg}}</h1>
    <h3>
      {{$store.state.count}} - {{count}}
    </h3>
    <p>
      <button @click="$store.commit('add')">加</button>
      <button @click="$store.commit('reduce')">减</button>
    </p>
  </div>
</template>

<script>
  import store from '@/vuex/store';
  import {mapState,mapMutations,mapGetters} from 'vuex';

  export default {
    name: "Count",
    data() {
      return {
        msg: 'hello vuex'
      }
    },
    /* computed: {
      count(){
        return this.$store.state.count;
      }
     },*/
    /*computed: mapState({
      count: state => state.count
    }),*/
    computed: {
      ...mapState(['count']),
      ...mapGetters(['count']),
    },
    store
  }
</script>

<style scoped>
</style>
